<template>
  <el-dialog
    title="修改项目"
    :visible="value"
    width="1280px"
    @close="handleClose"
  >
    <billing
      v-if="value"
      ref="billing"
      :order-id="orderId"
      :patient="patient"
      :appointment="appointment"
      @cancel="handleClose"
    ></billing>
  </el-dialog>
</template>

<script>
import { getProject } from '@/api/erp/project'

import Billing from '@/components/yiya/Billing'

export default {
  name: 'ToOrder',
  components: {
    Billing,
  },
  model: {
    prop: 'value',
    event: 'close',
  },
  props: {
    value: {
      type: Boolean,
      default: false,
    },
    orderId: {
      type: Number,
      default: 0,
    },
    data: {
      type: Array,
      default: () => [],
    },
    patient: {
      type: Object,
      default: () => ({}),
    },
    appointment: {
      type: Object,
      default: () => ({}),
    },
  },
  watch: {
    value(val) {
      if (val) {
        this.init()
      }
    },
  },
  methods: {
    async init() {
      const projectList = [...this.data]
      const projects = []
      while (projectList.length) {
        const project = projectList.shift()
        const { data } = await getProject(project.itemId)
        projects.push({
          ...data,
          price1: data.price1.toFixed(2),
          price2: data.price2.toFixed(2),
          ...project,
        })
      }
      this.$refs.billing.pushProject(projects)
    },
    handleClose() {
      this.$emit('close', false)
    },
  },
}
</script>

<style scoped></style>
